<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport"
        content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
    <title>工作提示</title>
    <link rel="stylesheet" href="css/vant.min.css">
    <link rel="stylesheet" href="css/common.css">
    <link rel="stylesheet" href="css/workTips.css">
</head>

<body>
    <div id="app">
        <div class="flex-col page">
            <div class="flex-col flex-auto group_2">
                <div class="flex-col group_3 space-y-30"
                    style="position: fixed;top: 0;left: 0; width: 100%;background: #ededed;">
                    <div class="flex-row space-x-20">
                        <div class="flex-col items-center space-y-10" @click="changeIdexTab(0)"
                            :class="indexTab==0?'equal-division-item':'equal-division-item_2'">
                            <div :class="indexTab==0?'group_4':'group_5'">
                                <span class="font_2" :class="indexTab==0?'text_2':''" v-cloak>{{threeNum}}</span>
                                <span :class="indexTab==0?'font_3':'font_4'">家</span>
                            </div>
                            <span :class="indexTab==0?'font_3':'font_5'">3月未检查</span>
                        </div>
                        <div class="flex-col items-center  space-y-13" @click="changeIdexTab(1)"
                            :class="indexTab==1?'equal-division-item':'equal-division-item_2'">
                            <div :class="indexTab==1?'group_4':'group_5'">
                                <span class="font_2" :class="indexTab==1?'text_2':''" v-cloak>{{sixNum}}</span>
                                <span :class="indexTab==1?'font_3':'font_4'">家</span>
                            </div>
                            <span :class="indexTab==1?'font_3':'font_5'">半年未检查</span>
                        </div>
                        <div class="flex-col items-center  space-y-13" @click="changeIdexTab(2)"
                            :class="indexTab==2?'equal-division-item':'equal-division-item_2'">
                            <div :class="indexTab==2?'group_4':'group_5'">
                                <span class="font_2" :class="indexTab==2?'text_2':''" v-cloak>{{allNum}}</span>
                                <span :class="indexTab==2?'font_3':'font_4'">家</span>
                            </div>
                            <span :class="indexTab==2?'font_3':'font_5'">一年未检查</span>
                        </div>
                    </div>
                    <!-- <div class="flex-row items-center">
                        <div class="flex-row flex-auto section space-x-10">
                            <van-field v-model="value" left-icon="search" placeholder="请输入场所名称进行筛选" />
                        </div>
                        <span class="font_3 text_4" @click="showScreen=true">筛选</span>
                        <img class="shrink-0 image_7" @click="showScreen=true" src="images/screen_icon.png" />
                    </div> -->
                </div>
                <!-- 三月 -->
                <div class="flex-col list" v-cloak v-if="indexTab == 0"
                    style="width: 95%;margin: 100px auto 0 auto;margin-bottom: 50px;">
                    <div v-if="threeList.length != 0">
                        <div class="flex-col list-item" v-for="(item,i) in threeList" :key="i">
                            <div class="flex-row items-center space-x-10">
                                <span class="font_1" v-cloak>{{item.place_name}}</span>
                                <img class="image_7" src="images/nine.png" v-if="item.is_small_place == '1'" />
                            </div>
                            <div class="flex-row group_6 space-x-10">
                                <div class="flex-col justify-start items-center text-wrapper" v-cloak
                                    v-if="item.risk_level == 2">
                                    <span class="font_6">高风险</span>
                                </div>
                                <div class="flex-col justify-start items-center text-wrapper_99" v-cloak
                                    v-if="item.risk_level == 1">
                                    <span class="text_66">低风险</span>
                                </div>
                                <div class="flex-col justify-start items-center text-wrapper_2" v-cloak
                                    v-if="item.has_trouble == 1">
                                    <span class="font_7">有隐患</span>
                                </div>
                                <div class="flex-col justify-start items-center text-wrapper_3" v-cloak
                                    v-if="item.has_images == 0">
                                    <span class="font_8">无照片</span>
                                </div>
                            </div>
                            <div class="flex-row justify-between items-center">
                                <div class="flex-row items-center space-x-20">
                                    <div class="group_7">
                                        <span class="font_5">安全员：</span>
                                        <span class="font_9" v-cloak>{{item.safety_user}}</span>
                                    </div>
                                    <div class="shrink-0 section_2"></div>
                                    <div class="group_7">
                                        <span class="font_5">检查次数：</span>
                                        <span class="font_10" v-cloak>{{item.check_count}}</span>
                                        <span class="font_9" v-cloak>/{{item.total_check_count}}</span>
                                    </div>
                                </div>
                                <div class="flex-col justify-start items-center text-wrapper_4"
                                    @click="goProjectDetails(item.place_uuid)">
                                    <span class="font_11">查看详情</span></div>
                            </div>
                            <span class="self-start font_12 text_5" v-cloak>最近检查时间：{{item.last_check_time}}</span>
                            <div class="flex-row group_8 space-x-10">
                                <img class="image_7 image_8" src="images/address.png" />
                                <span class="font_9" v-cloak>{{item.address}}</span>
                            </div>
                        </div>
                    </div>

                    <div v-if="threeList.length == 0" style="width: 100%; height: 80vh;">
                        <div class="ub-div">
                            <img src="images/noData.png" class="ub-noData_img" alt="">
                            <p class="ub-noData_text">暂无数据</p>
                        </div>
                    </div>
                </div>

                <!-- 半年 -->
                <div class="flex-col list" v-cloak v-if="indexTab == 1"
                    style="width: 95%;margin: 100px auto 0 auto;margin-bottom: 50px;">
                    <div v-if="sixList.length != 0">
                        <div class="flex-col list-item" v-for="(item,i) in sixList" :key="i">
                            <div class="flex-row items-center space-x-10">
                                <span class="font_1" v-cloak>{{item.place_name}}</span>
                                <img class="image_7" src="images/nine.png" v-if="item.is_small_place == '1'" />
                            </div>
                            <div class="flex-row group_6 space-x-10">
                                <div class="flex-col justify-start items-center text-wrapper"
                                    v-if="item.risk_level == 2">
                                    <span class="font_6">高风险</span>
                                </div>
                                <div class="flex-col justify-start items-center text-wrapper_99"
                                    v-if="item.risk_level == 1">
                                    <span class="text_66">低风险</span>
                                </div>
                                <div class="flex-col justify-start items-center text-wrapper_2"
                                    v-if="item.has_trouble == 1">
                                    <span class="font_7">有隐患</span>
                                </div>
                                <div class="flex-col justify-start items-center text-wrapper_3"
                                    v-if="item.has_images == 0">
                                    <span class="font_8">无照片</span>
                                </div>
                            </div>
                            <div class="flex-row justify-between items-center">
                                <div class="flex-row items-center space-x-20">
                                    <div class="group_7">
                                        <span class="font_5">安全员：</span>
                                        <span class="font_9" v-cloak>{{item.safety_user}}</span>
                                    </div>
                                    <div class="shrink-0 section_2"></div>
                                    <div class="group_7">
                                        <span class="font_5">检查次数：</span>
                                        <span class="font_10" v-cloak>{{item.check_count}}</span>
                                        <span class="font_9" v-cloak>/{{item.total_check_count}}</span>
                                    </div>
                                </div>
                                <div class="flex-col justify-start items-center text-wrapper_4"
                                    @click="goProjectDetails(item.place_uuid)">
                                    <span class="font_11">查看详情</span></div>
                            </div>
                            <span class="self-start font_12 text_5" v-cloak>最近检查时间：{{item.last_check_time}}</span>
                            <div class="flex-row group_8 space-x-10">
                                <img class="image_7 image_8" src="images/address.png" />
                                <span class="font_9" v-cloak>{{item.address}}</span>
                            </div>
                        </div>
                    </div>

                    <div v-if="sixList.length == 0" style="width: 100%; height: 80vh;">
                        <div class="ub-div">
                            <img src="images/noData.png" class="ub-noData_img" alt="">
                            <p class="ub-noData_text">暂无数据</p>
                        </div>
                    </div>
                </div>

                <!-- 一年 -->
                <div class="flex-col list" v-cloak v-if="indexTab == 2"
                    style="width: 95%;margin: 100px auto 0 auto;margin-bottom: 50px;">
                    <div v-if="allList.length != 0">
                        <div class="flex-col list-item" v-for="(item,i) in allList" :key="i">
                            <div class="flex-row items-center space-x-10">
                                <span class="font_1" v-cloak>{{item.place_name}}</span>
                                <img class="image_7" src="images/nine.png" v-if="item.is_small_place == '1'" />
                            </div>
                            <div class="flex-row group_6 space-x-10">
                                <div class="flex-col justify-start items-center text-wrapper"
                                    v-if="item.risk_level == 2">
                                    <span class="font_6">高风险</span>
                                </div>
                                <div class="flex-col justify-start items-center text-wrapper_99"
                                    v-if="item.risk_level == 1">
                                    <span class="text_66">低风险</span>
                                </div>
                                <div class="flex-col justify-start items-center text-wrapper_2"
                                    v-if="item.has_trouble == 1">
                                    <span class="font_7">有隐患</span>
                                </div>
                                <div class="flex-col justify-start items-center text-wrapper_3"
                                    v-if="item.has_images == 0">
                                    <span class="font_8">无照片</span>
                                </div>
                            </div>
                            <div class="flex-row justify-between items-center">
                                <div class="flex-row items-center space-x-20">
                                    <div class="group_7">
                                        <span class="font_5">安全员：</span>
                                        <span class="font_9" v-cloak>{{item.safety_user}}</span>
                                    </div>
                                    <div class="shrink-0 section_2"></div>
                                    <div class="group_7">
                                        <span class="font_5">检查次数：</span>
                                        <span class="font_10" v-cloak>{{item.check_count}}</span>
                                        <span class="font_9" v-cloak>/{{item.total_check_count}}</span>
                                    </div>
                                </div>
                                <div class="flex-col justify-start items-center text-wrapper_4"
                                    @click="goProjectDetails(item.place_uuid)">
                                    <span class="font_11">查看详情</span></div>
                            </div>
                            <span class="self-start font_12 text_5" v-cloak>最近检查时间：{{item.last_check_time}}</span>
                            <div class="flex-row group_8 space-x-10">
                                <img class="image_7 image_8" src="images/address.png" />
                                <span class="font_9" v-cloak>{{item.address}}</span>
                            </div>
                        </div>
                    </div>

                    <div v-if="allList.length == 0" style="width: 100%; height: 80vh;">
                        <div class="ub-div">
                            <img src="images/noData.png" class="ub-noData_img" alt="">
                            <p class="ub-noData_text">暂无数据</p>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <div class="ub-goBack" @click="goHome()" style="bottom: 160px;">
            <img src="images/navIcon1.png" alt="" class="ub-goBack_img">
            <div class="ub-goBack_text">返回首页</div>
        </div>

        <div class="ub-login_box" v-if="loadShow" v-colak>
            <van-loading size="24px" color="#0094ff" text-color="#0094ff" class="ub-login_po" vertical>加载中...
            </van-loading>
        </div>
    </div>


    <script src="js/jquery.min.js" type="text/javascript" charset="utf-8"></script>
    <script src="js/vue.min.js" type="text/javascript" charset="utf-8"></script>
    <script src="js/jweixin-1.6.0.js" type="text/javascript" charset="utf-8"></script>
    <script src="js/jwt-decode.min.js" type="text/javascript" charset="utf-8"></script>
    <script src="js/cHttp.js?v=1.0.0" type="text/javascript" charset="utf-8"></script>
    <script src="js/flv.min.js" type="text/javascript" charset="utf-8"></script>
    <script src="js/wxPublic.js?v=12.0.0" type="text/javascript" charset="utf-8"></script>
    <script src="js/element-ui.js" type="text/javascript" charset="utf-8"></script>
    <script src="js/g-tConversion.js" type="text/javascript" charset="utf-8"></script>
    <script src="js/t-gConversion.js" type="text/javascript" charset="utf-8"></script>

    <script>
        var vue = new Vue({
            el: '#app',
            data() {
                return {
                    indexTab: 0, //0,3月未检查 1.半年未检查 2.一年未检查
                    value: '',
                    showScreen: false, //筛选弹窗
                    toKen: '',
                    threeList: [], // 三个月未检查
                    threeNum: 0, // 三个月未检查数量
                    sixList: [], // 六个月未检查
                    sixNum: 0, // 六个月未检查数量
                    allList: [], // 十二个月未检查
                    allNum: 0, // 十二个月未检查数量
                    loadShow: false,
                }
            },
            created() {
                this.toKen = localStorage.getItem('toKen');
                this.getThreeList();
                this.getSixList();
                this.getAllList();
            },
            methods: {
                // 切换头部tab
                changeIdexTab(val) {
                    this.indexTab = val
                },
                goProjectDetails(uuid) {
                    // location.href = './projectDetails.html?uuid=' + uuid;
                },
                // 三个月未检查
                getThreeList() {

                },
                // 六个月未检查
                getSixList() {

                },
                // 十二个月未检查
                getAllList() {

                },
                // 返回首页
                goHome() {
                    location.href = "./index.html?from=1";
                }
            },
        })
    </script>
</body>

</html>